<template>
    <form>
        <p>商品名称：<input v-model.trim="goodsName" type="text"></p>
        <p>商品价格：<input v-model.number="goodsPrice" type="text"></p>
        <p><button @click.prevent="saveGoodsInfo">保存</button></p>
    </form>
</template>

<script>
import {mapMutations} from "vuex";

export default {
    name: "AddGoods",
    data(){
        return {
            goodsName:"",
            goodsPrice:0
        }
    },
    mounted(){
        console.log(this.$store.state.goods.goodsList);
    },
    methods:{
        ...mapMutations(["ADD_GOODS"]),
        saveGoodsInfo(){
            // 非简写
            // this.$store.commit("ADD_GOODS",{
            //     goodsName:this.goodsName,
            //     goodsPrice:this.goodsPrice
            // });

            // 简写：
            this.ADD_GOODS({
                goodsName:this.goodsName,
                goodsPrice:this.goodsPrice
            })
            // 跳转到地址为/goodsList 的路由
            this.$router.push("/goodsList");
        }
    }
}
</script>

<style scoped>

</style>